﻿<{require file="block/header.html"}>
<script language="javascript" type="text/javascript" src="images/nivo-slider/"></script>
<div class="AllWrapInside clearfix">
    <div class="mainColumn pageMain">
        <{widgets id="nav"}> <{main}>
    </div>
    <div class="sideColumn pageSide">
        <{widgets id="sideritems"}>
    </div>
</div>
<div id="slider-wrapper" class="slider-wrapper theme-default" style="overflow: hidden">
    <div id="slider" class="nivoSlider">
        <a href="product-97.html">
            <img src="images/jazz/nivo-slider01.jpg" alt="" title="#" /></a> <a href="product-220.html">
                <img src="images/jazz/nivo-slider02.jpg" alt="" /></a> <a href="product-214.html">
                    <img src="images/jazz/nivo-slider03.jpg" alt="" /></a> <a href="#">
                        <img src="images/jazz/nivo-slider04.jpg" alt="" /></a>
    </div>
    <div id="htmlcaption" class="nivo-html-caption">
    </div>
</div>
<div class="index_part">
    <img src="images/jazz/mainRecommand.jpg" border="0" alt="新品推介" usemap="#mainRecommand">
    <map name="mainRecommand">
        <area href="" shape="rect1" coords="330, 119, 625, 445">
          <area href="product-191.html" shape="rect1" coords="646, 116, 942, 442">
            <area href="product-192.html" shape="rect1" coords="21, 559, 304, 885">
              <area href="product-193.html" shape="rect1" coords="650, 1001, 944, 1327">
                <area href="product-195.html" shape="rect1" 
            coords="19, 1002, 302, 1328">
                  <area href="product-194.html" shape="rect1" 
            coords="647, 560, 942, 886">
                    <area href="product-233.html" shape="rect1" 
            coords="330, 1002, 623, 1328">
                      <area href="product-189.html" shape="rect1" 
            coords="19, 121, 302, 447">
    </map>
</div>

<div class="index_part">
    <div id="slider-wrapper2" class="slider-wrapper theme-default" style="margin: 20 auto;
        width: 950px; height: 490px">
        <div id="slider2" class="nivoSlider">
            <a href="#">
                <img src="images/jazz/ns2001.jpg" data-thumb="http://www.ilongshe.com/themes/jazzlaotou/images/jazz/ns2001_thumb.jpg"
                    alt="" /></a> <a href="#">
                        <img src="images/jazz/ns2002.jpg" data-thumb="http://www.ilongshe.com/themes/jazzlaotou/images/jazz/ns2002_thumb.jpg"
                            alt="" title="#" /></a> <a href="#">
                                <img src="images/jazz/ns2003.jpg" data-thumb="http://www.ilongshe.com/themes/jazzlaotou/images/jazz/ns2003_thumb.gif"
                                    alt="" /></a> <a href="#">
                                        <img src="images/jazz/ns2004.jpg" data-thumb="http://www.ilongshe.com/themes/jazzlaotou/images/jazz/ns2004_thumb.jpg"
                                            alt="" /></a> <a href="#">
                                                <img src="images/jazz/ns2005.jpg" data-thumb="http://www.ilongshe.com/themes/jazzlaotou/images/jazz/ns2005_thumb.jpg"
                                                    alt="" /></a>
        </div>
        <div id="htmlcaption" class="nivo-html-caption">
        </div>
    </div>
</div>
<script type="text/javascript" src="images/nivo-slider/jquery.nivo.slider.pack.js"></script>
<script type="text/javascript">
    var jSlider;
    var max_client_width = 1680;

    jQuery(window).load(function () {
        InitNivoSider();
        InitNivoSider2();
    });

    function InitNivoSider() {
        jSlider = jQuery('#slider');
        jSlider.nivoSlider({
            effect: 'random',
            slices: 15,
            boxCols: 8,
            boxRows: 4,
            animSpeed: 500,
            pauseTime: 3000,
            startSlide: 0
        });

        jSlider.css("width", max_client_width);
        jQuery('#slider-wrapper').css("height", jSlider.height());
        setNivoSiderAuto();

        jQuery(window).resize(function () {
            setNivoSiderAuto();
        });
    }

    function InitNivoSider2() {
        jQuery('#slider2').nivoSlider({
            effect: 'random',
            slices: 15,
            boxCols: 8,
            boxRows: 4,
            animSpeed: 500,
            pauseTime: 3000,
            startSlide: 0,
            controlNavThumbs: true
        });
    }

    function setNivoSiderAuto() {
        jSlider.css("left", (document.documentElement.clientWidth - max_client_width) / 2);
        jQuery(".nivo-directionNav").children(".nivo-prevNav").first().css("left", (max_client_width - document.documentElement.clientWidth) / 2 + 50);
        jQuery(".nivo-directionNav").children(".nivo-nextNav").first().css("right", (max_client_width - document.documentElement.clientWidth) / 2 + 50);
    }
</script>
<div class="index_part">
    <img src="images/jazz/top1.jpg" border="0" alt="夏季热卖单品" usemap="#top1">
    <map name="top1">
    </map>
    <img src="images/jazz/top2.jpg" border="0" alt="T恤专区" usemap="#top2">
    <map name="top2">
    </map>
    <img src="images/jazz/top3.jpg" border="0" alt="衬衫专区" usemap="#top3">
    <map name="top3">
    </map>
</div>
<{require file="block/footer.html"}>